<!--  -->
<template>
  <div class='announcement'>
    <!-- <el-button type="text" @click="dialogTableVisible = true"></el-button> -->
    <el-dialog :title="dataTitle" :visible.sync="dialogTableVisible">
      <el-card class="box-card">
        <el-scrollbar style="height:450px;border-top: 1px solid #e5e5e5;">
          <div class="item ql-bubble">
            <div v-html="dataContent" class="infoDetailsData ql-editor"></div>
          </div>
        </el-scrollbar>
      </el-card>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" size="medium" @click="dialogTableVisible = false">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
import { selectfreshnotice } from '../../../api/homeIndex';
export default {
  name: 'announcement',
  components: {},
  data () {
    return {
      dialogTableVisible: false,
      dataContent: '',
      dataTitle: ''
    };
  },
  computed: {},
  watch: {},
  methods: {
    // 获取站点弹框信息
    selectfreshnotice () {
      let query = new FormData();
      query.append('isEdit', '1')
      selectfreshnotice(query).then((res) => {
        if (res.success) {
          if (res.data) {
            // decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。
            this.dataContent = decodeURI(res.data.content)
            this.dataTitle = res.data.title
            if (res.data.status == 1) {
              this.dialogTableVisible = true
            } else {
              this.dialogTableVisible = false;
            }

          } else {
            this.dialogTableVisible = false
          }
        }
      })
    }
  },
  created () {
    // 获取站点弹框信息 暂时不上 2020-05-29 晚
    this.selectfreshnotice()
  },
  mounted () {

  },
  beforeCreate () { },
  beforeMount () { },
  beforeUpdate () { },
  updated () { },
  beforeDestroy () { },
  destroyed () { },
  activated () { },
}
</script>
<style  scoped>
.announcement /deep/ .el-dialog__header {
    padding: 30px 20px 30px;
    border-bottom: 2px solid rgba(0, 147, 255, 1);
}

.announcement /deep/ .el-dialog__headerbtn {
    top: 26px;
    font-size: 30px;
}
.announcement /deep/ .el-dialog__title {
    font-weight: 600;
}

.announcement /deep/ .el-dialog__headerbtn .el-dialog__close {
    color: rgba(0, 147, 255, 1);
}

.announcement /deep/ .el-dialog__body {
    padding: 0px 20px;
}

.announcement /deep/ .box-card {
    width: 100%;
}

.announcement /deep/ .el-button--medium {
    width: 120px;
}
.announcement /deep/ .el-dialog__footer {
    padding: 15px 20px 15px;
    text-align: right;
    box-sizing: border-box;
    border-top: 1px solid #e5e5e5;
}
.text {
    /* font-size: 14px; */
}

.item {
    max-height: 450px;
}

.box-card {
    /* width: 480px; */
}
</style>